{template '_header'}

{template 'diypage/_common'}

<div class="page-heading">
    <span class='pull-right' style="padding: 15px 10px;">
	    	<strong>左侧跟随</strong>
	    	<input class="js-switch small" id="phoneposition" type="checkbox" value="1" checked />
    </span>
    <h2>{if !empty($menu)}编辑{else}新建{/if}自定义菜单 {if !empty($menu)}<small>(菜单名称: {$menu['name']})</small>{/if}</h2>
</div>

<div class="diy-phone" style="position: fixed;" data-merch="{php echo intval($_W['merchid'])}">
    <div class="phone-head"></div>
    <div class="phone-body">
        <div class="phone-title" id="page">自定义菜单</div>
        <div class="phone-main" id="phone" style="position: relative; overflow: hidden">
            <p style="text-align: center; line-height: 400px">loading...</p>
        </div>
    </div>
    <div class="phone-foot"></div>
</div>  
 
<div class="diy-editor form-horizontal" id="diy-editor" style="float: right;">
    <div class="editor-arrow"></div>
    <div class="inner"></div>
</div>



<div class="diy-menu">
    <div class="action">
        <nav class="btn btn-default btn-sm" style="float: left; display: none" id="gotop"><i class="icon icon-top" style="font-size: 12px"></i> 返回顶部</nav>
        <nav class="btn btn-primary btn-sm btn-save" data-type="save">保存菜单</nav>
    </div>
</div>

{template 'diypage/_template_menu'}

<script language="javascript">
    var path = '../../plugin/diypage/static/js/diy.menu';
    myrequire([path,'tpl','web/biz'],function(modal,tpl){
        modal.init({
            tpl: tpl,
            attachurl: "{$_W['attachurl']}",
            id: '{php echo intval($_GPC["id"])}',
            menu: {if !empty($menu['data'])}{php echo json_encode($menu['data'])}{else}null{/if},
            merch: {if $_W['plugin']=='merch' && !empty($_W['merchid'])}1{else}0{/if}
        });
    });
    function showSubMenu(obj) {
        $(obj).toggleClass('on').siblings().removeClass('on');
        $(obj).find('.child').toggleClass('in');
        $(obj).siblings().find('.child').removeClass('in')
    }
    $(function () {
       $("#phoneposition").click(function () {
           var div = $(this).next();
           if(div.hasClass('checked')){
               $(".diy-phone").css({'position': 'fixed'});
           }else{
               $(".diy-phone").css('position', 'relative');
           }
       });
    });
</script>

{template '_footer'}